<template>
    <div class="center_div">
        <el-form ref="form" :model="applyDetail" label-width="100px" style="margin-top:50px;">
            <el-form-item label="使用人" prop="username">
                <el-input v-model="applyDetail.username" disabled style="width: 50%;"></el-input>
            </el-form-item>
            <el-form-item label="申请模块" prop="applyModule">
                <el-tag>{{applyDetail.applyModule}}</el-tag>
            </el-form-item>
            <el-form-item label="使用时间" prop="useTime">
                <el-date-picker v-model="applyDetail.useTime" type="daterange"
                                value-format="yyyy-MM-dd" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
            </el-form-item>
            <el-form-item label="使用范围" prop="region" >
                <el-input v-model="applyDetail.region" placeholder="请填写使用范围，例如：办公文件审批" style="width: 50%;"></el-input>
            </el-form-item>
            <el-form-item label="申请原因" prop="reason">
                <el-input type="textarea" placeholder="请填写使用原因，越详细审批通过率越高哦" v-model="applyDetail.reason" style="width: 50%;"></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="onSubmit">立即申请</el-button>
            </el-form-item>
        </el-form>
    </div>
</template>

<script>
    export default {
        name: "apply-chapter",
        data() {
            return {
                applyDetail: {username: this.$store.state.user.user.employeename ,applyModule: '用章申请', useTime: '', reason: '', region: '', isPersonal: '1', otherPersonal: '',status: 0}
            }
        },
        methods: {
            onSubmit() {
                if (this.applyDetail.useTime.length !== 2) {
                    this.$message.error('未选择日期')
                    return
                }
                if (this.applyDetail.reason.length === 0 || this.applyDetail.region.length === 0) {
                    this.$message.error('存在参数未填写')
                    return
                }
                let useTime =  this.applyDetail.useTime[0] + ' -> ' +  this.applyDetail.useTime[1]
                this.applyDetail.useTime = useTime
                console.log(this.applyDetail)
                // this.applyChapter()
            },
            // async applyChapter(){
            //   let {code ,data ,msg} = await this.$post('/##',
            //           {data: this.applyDetail})
            //   if(code === 200) {
            //     console.log(data)
            //     this.$message({
            //       message: '申请成功，请等待后序审批',
            //       type: 'success'
            //     })
            //   }else {
            //     this.$message.error(msg)
            //   }
            // },
        }
    }
</script>

<style>
    .center_div{
        width: 60%;
        margin-left:auto;
        margin-bottom: 50px;
        margin-top: 50px;
    }
</style>